import React, { useRef, useImperativeHandle, forwardRef } from 'react';
import { Collapse } from 'antd';
import ReturnResult from '../../../components/Add/returnResult';
import SetUp from './setUp';

const DefineReturn = forwardRef((props, ref) => {
  const returningMapsRef = useRef();

  useImperativeHandle(ref, () => ({
    getDrData: () => returningMapsRef.current.getData(),
  }));

  const renderInterfaceNode = [
    {
      title: '返回结果基础定义',
      component: <ReturnResult {...props} />,
    },
    {
      title: '设置映射',
      component: <SetUp {...props} ref={returningMapsRef} />,
    },
  ];

  return (
    <>
      <Collapse defaultActiveKey={[0, 1]} bordered={false} expandIconPosition='right' ghost={true}>
        {renderInterfaceNode.map((item, index) => (
          <Collapse.Panel header={item.title} key={index}>
            {item.component}
          </Collapse.Panel>
        ))}
      </Collapse>
    </>
  );
});
export default DefineReturn;
